<header class="marketing-banner">
  <h1 class="banner-headline no-toc no-anchor">Angular features</h1>
</header>

<article class="center-layout">
  <div class="feature-section">
    <div class="feature-header">
      <div class="text-headline">Any app size</div>
      <img src="generated/images/marketing/features/feature-icon.svg" height="70px" alt="Feature icon">
    </div>
    <div class="feature-row">

      <div class="feature">
        <div class="feature-title">Start quickly</div>
        <p class="text-body">You can start small knowing that Angular's tools support your apps as they grow.
          <a href="/scaling">Learn more</a>
        </p>
      </div>

      <div class="feature">
        <div class="feature-title">Enterprise capable</div>
        <p class="text-body">Angular supports you with an opinionated platform as your team and apps grow.
          This allows you to build testable, and scalable user interfaces that perform well as they grow.</p>
      </div>

      <div class="feature">
        <div class="feature-title">Predictable releases</div>
        <p class="text-body">Angular's predictable release schedule and update tools help you keep your
          app up-to-date with the latest advancements in the framework and the web platform.
        <a href="/guide/releases">Learn more</a></p>
      </div>
    </div>
    <hr>
  </div>

  <div class="feature-section">
    <div class="feature-header">
      <div class="text-headline">A great community</div>
      <img src="generated/images/marketing/features/feature-icon.svg" height="70px" alt="Feature icon">
    </div>
    <div class="feature-row">

      <div class="feature">
        <div class="feature-title">Community resources</div>
        <p class="text-body">The Angular community is a global community that's
          made up of many local organizations.
          <a href="resources?category=community">Learn more</a>
        </p>
      </div>

      <div class="feature">
        <div class="feature-title">Education resources</div>
        <p class="text-body">The Angular community offers books, workshops, and
          formal training to help you get started.
          <a href="resources?category=education">Learn more</a>
        </p>
      </div>

      <div class="feature">
        <div class="feature-title">Development resources</div>
        <p class="text-body">The Angular community and team offer resources to
          help all stages of your development.
          <a href="resources?category=development">Learn more</a>
        </p>
      </div>

    </div>
    <hr>
  </div>

  <div class="feature-section">
    <div class="feature-header">
      <div class="text-headline">Build productively</div>
      <img src="generated/images/marketing/features/feature-icon.svg" height="70px" alt="Feature icon">
    </div>
    <div class="feature-row">

      <div class="feature">
        <div class="feature-title">Powerful command-line interface</div>
        <p class="text-body">The Angular command-line interface (CLI)
          supports starting a project and growing it to production,
          maintaining consistency across teams and projects.
          <a href="cli">Learn more</a></p>
      </div>

      <div class="feature">
        <div class="feature-title">Forms and routing</div>
        <p class="text-body">Angular's forms and routing, developed and supported by the Angular team,
          provide stability and integration with the rest of the platform.
          Learn more about <a href="guide/forms-overview">forms</a> and
          <a href="guide/routing-overview">routing</a>.
        </p>
      </div>

      <div class="feature">
        <div class="feature-title">Development tools</div>
        <p class="text-body">Angular's integrated development environment (IDE)
          tools offer autocompletion and type checking.
          Profiling tools give a preview of your app's performance.</p>
      </div>
    </div>
    <hr>
  </div>


  <div class="feature-section">
    <div class="feature-header">
      <div class="text-headline">For everyone, everywhere</div>
      <img src="generated/images/marketing/features/feature-icon.svg" height="70px" alt="Feature icon">
    </div>
    <div class="feature-row">

      <div class="feature">
        <div class="feature-title">Internationalization tools</div>
        <p class="text-body">Angular's Internationalization (i18n) and Localization
          (l10n) tools help your app reach people around the world.
          <a href="guide/i18n-overview">Learn more</a></p>
      </div>

      <div class="feature">
        <div class="feature-title">Accessibility tools</div>
        <p class="text-body">Create accessible apps with ARIA-enabled components, developer guides,
          and built-in Accessibility (a11y) test infrastructure.
          <a href="guide/accessibility">Learn more</a></p>
      </div>

      <div class="feature">
        <div class="feature-title">Component libraries</div>
        <p class="text-body">Many component libraries are available for Angular apps to use.
          Material component library is one library that thousands of Google apps use with
          confidence.
          Learn more about <a href="https://material.angular.io/">Angular Material</a>.
        </p>
      </div>
    </div>
    <hr>
  </div>

  <div class="cta-bar announcement-bar">
    <a class="button" href="quick-start">Try Angular</a>
  </div>

</article>
